<template>
  <el-dialog
    label-width="80px"
    title="添加合同"
    :visible.sync="dialogVisible"
    append-to-body
    width="40%">
    <el-form :model="form" ref="form" :rules="rules">
      <el-row :gutter="10">
        <el-col :span="12">
          <el-form-item label="客户手机号" prop="phone">
            <el-input v-model="form.phone"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="合同编号" prop="contractNo">
            <el-input v-model="form.contractNo"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="邮箱" prop="mailbox">
            <el-input v-model="form.mailbox"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="10">
        <el-col :span="12">
          <el-form-item prop="fileName" label="上传文件">
            <file-upload ref="fileUpload"
                         :limit="1"
                         :fileSize="5"
                         :fileType="['pdf']"
                         @input="handleInput">
            </file-upload>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible=false">取消</el-button>
       <el-button type="primary" @click="submitForm">确定</el-button>
    </span>

  </el-dialog>

</template>

<script>
  import FileUpload from '@/components/FileUpload';
  import {transform} from "../../../../api/crm/businessTrack";

  export default {
    name: "transform",
    props: {
      //从父组件传值过来
      businessId: {type: [String, Number]},
    },
    components: {FileUpload},
    data() {
      return {
        dialogVisible: false,
        id: null,
        form: {},
        rules: {
          phone: [{required: true, message: '手机号码不能为空', trigger: 'blur'}],
          contractNo: [{required: true, message: '合同不能为空', trigger: 'blur'}],
          mailbox: [{required: true, message: '邮箱不能为空', trigger: 'blue'}],
        }
      };
    },
    methods: {
      resetForm() {
        this.form = {
          id: this.businessId,
          phone: null,
          contractNo: null,
          fileName: null,
          mailbox:null,
        }
      },
      submitForm() {
        this.$refs.form.validate(valid => {
          if (valid) {
            this.form.record = '商机转客户'

            this.form.id = this.id;
            transform(this.form).then(resp => {
              this.$message.success('成功');
              this.$emit('success')
              this.dialogVisible = false
            })
          }
        })
      },
      handleInput(urls) {
        this.form.filename = urls;
      }
    }
  }
</script>

<style scoped>

</style>
